<template>
  <div>
    <h3>v-model处理其他表单元素</h3>
    <!-- v-model ->  select标签绑定 
            value   ->  option标签添加
      
      -->
    <div>
      <!-- 下拉框 -->
      <select name="" id="" v-model="hai">
        <option value="1001">上海</option>
        <option value="2002">北京</option>
        <option value="3003">深圳</option>
        <option value="4004">广州</option>
      </select>
    </div>
    <div>
      <!-- 复选框 多个情况
          v-model：类型必须是一个数组，数组作用：装载每一项的value数据
          另外还需要给每一个表单添加value属性
          -->
      <input type="checkbox" value="抽烟" v-model="hello" />抽烟
      <input type="checkbox" value="自行车" v-model="hello" />自行车
      <input type="checkbox" value="骑摩托" v-model="hello" />骑摩托
      <input type="checkbox" value="喝酒" v-model="hello" />喝酒
      <div>
          <!-- 复选框一个情况下
          v-model：类型是一个布尔值
          -->
          <input type="checkbox" v-model="hhh">
      </div>
      <div>
          <!-- 单选框
          男 ：1
          女： 0
          -->
          性别
          <input type="radio" value="男" v-model="gait">男
          <input type="radio" value="女" v-model="gait">女
      </div>
      <dir>
          <!-- 文本域 -->
          <textarea name="" id="" cols="30" rows="10" v-model="tuh"></textarea>
      </dir>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      hai: 3003,
      hello: [],
      hhh:true,
      gait:1,
      tuh:true
    };
  },
};
</script>

<style>
</style>